<template>
	<view>
		<view class="header">
			<image src="../../static/img/teacher/login/headerBg.png" mode=""></image>
			<view class="container">
				<text class="title">登录</text>
				<view class="form">
					<text class="form_userName">账号</text>
					<view class="isRight" v-show="phoneFlag"><image style="width: 36rpx;height: 36rpx;" src="../../static/img/teacher/login/blueRound.png" mode=""></image></view>
					<input
						@focus="selectHandle(0)"
						v-model="phone"
						class="phone"
						:class="current == 0 ? 'selectd' : ''"
						type="text"
						value=""
						maxlength="11"
						placeholder="请输入账号"
					/>
					<input
						@focus="selectHandle(1)"
						v-model="password"
						class="phone"
						:class="current == 1 ? 'selectd' : ''"
						type="password"
						value=""
						maxlength="16"
						placeholder="密码"
					/>
				</view>
			</view>
		</view>
		<view class="content">
			<image @click="rememberBtn" v-show="remember == false" class="round" src="../../static/img/teacher/login/round.png" mode=""></image>
			<image @click="rememberBtn" v-show="remember == true" class="round" src="../../static/img/teacher/login/blueRound.png" mode=""></image>
			<text @click="rememberBtn">记住账号</text>
			<view class="loginBtn" @click="loginHandle">
				登录
				<image class="loginBtnBg" src="../../static/img/teacher/login/shadow.png" mode=""></image>
			</view>
		</view>

		<view class="footer"><image src="../../static/img/teacher/login/footerBg.png" mode=""></image></view>
	</view>
</template>

<script>
import { login } from '@/api/teacher/login/login.js';
export default {
	data() {
		return {
			// phone: 'ceshishi',
			// password: '123456',
			current: null,
			phoneFlag: false,
			phone: '',
			password: '',
			remember: false,
		};
	},
	onLoad() {
		if(uni.getStorageSync('teacherUsername')){
			this.phone=uni.getStorageSync('teacherUsername')
		}
	},
	methods: {
		selectHandle(index) {
			this.current = index;
		},
		rememberBtn() {
			if (this.remember) {
				this.remember = false;
			} else [(this.remember = true)];
		},
		async loginHandle() {
			let res = await login(this.phone, this.password);
			// console.log(res);
			if (res.msg === '登录成功') {
				if (this.remember == true) {
					uni.setStorageSync('teacherUsername', this.phone);
				}
				uni.setStorageSync('teacherToken', res.data.coachoken);
				uni.reLaunch({
					url: './teacherCenter'
				});
			} else {
				uni.showToast({
					title: '账号或密码错误',
					icon: 'none'
				});
			}
		}
	},
	watch: {
		phone(val, oldVal) {
			//普通的watch监听
			if (val.length > 5) {
				this.phoneFlag = true;
			} else {
				this.phoneFlag = false;
			}
		}
	}
};
</script>

<style lang="scss">
@import './css/login.scss';
</style>
